<template>
    <div class="index clearafter">
        <module-head></module-head>
        <div class="content cbafter">
            <div class="w220 fl">
                <menu-list></menu-list>
            </div>
            <div class="w980 fr">
                <div class="h1_tit">
                    <h1>危急值</h1>
                </div>
                <!-- 危急值 -->
                <!-- 危急值 -->
                <div class="bs-example-modal-lg" id="edit_danger">
                    <div class="modal-dialog modal-lg">
                        <div class="modal-content">
                            <div class="modal-header"></div>
                            <div class="paientinfo">
                                <table>
                                    <tr>
                                        <td><img :src="headimg"></td>
                                        <td>
                                            <p><span class="name">{{patientinfo.personName}}</span><span>{{patientinfo.sexText}}</span><span class="age">{{patientinfo.personAge}}岁</span><span>|</span><span class="iphone">{{patientinfo.phoneNo}}</span></p>
                                        </td>
                                        <td>
                                            <button class="default ok" v-show="listordeal" @click="listshow">自测指标</button>
                                            <button class="default greynobg" v-show="!listordeal" @click="dealshow">返回上一页</button>
                                        </td>
                                    </tr>
                                </table>
                            </div>
                            <div class="modal-body">
                                <div class="twostep" >
                                    <div class="twostep_1">
                                        <h4>危急值</h4>
                                        <p><span>{{patientinfo.indexName}}</span><span :class="{'zhibiao2':parseFloat(patientinfo.indexVal)<parseFloat(patientinfo.normalValBottom),'zhibiao':parseFloat(patientinfo.indexVal)<parseFloat(patientinfo.normalValTop)}">{{patientinfo.indexVal}} {{patientinfo.indexUnit}}</span><span>措施：{{patientinfo.indexActionName==null?"无":patientinfo.indexActionName}}</span><span>症状：{{patientinfo.symptomlNameString==null?"无":patientinfo.symptomlNameString}}</span></p>
                                    </div>
                                    <div class="twostep_2">
                                        <h4>处理意见</h4>
                                        <form class="cbafter" id="search" v-on:submit.prevent="savedangerdeal">
                                            <div class="form-group">
                                                <div class="col-md-9">
                                                    <select class="form-control" v-model="dangervalDealTypeselect" required>
                                                        <option v-for="item in dangervalDealTypelist" value="{{item.key}}">{{item.text}}</option>
                                                    </select>
                                                </div>
                                                <div class="col-md-3">
                                                    <button class="default ok" type="submit">确定</button>
                                                </div>
                                            </div>
                                        </form>
                                    </div>
                                </div>
                                <div class="selftestlist">
                                    <self-test v-ref:selftestval></self-test>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>
<script>
import 'assets/lib/bootstrap-3.3.2/css/bootstrap.min.css'
import 'assets/lib/bootstrap-3.3.2/js/bootstrap.min.js'
import 'assets/reset.css'
import Public from 'assets/public.js'
import moduleHead from 'components/module-head'
import menuList from 'components/menu-list'
var headimg = require("assets/img/cs2.jpg");
import selfTest from 'components/self-test'
export default {
    data() {
            return {
                headimg: headimg,
                patientinfo: {
                    personName: "",
                    sexText: "",
                    personAge: "",
                    phoneNO: "",
                    applyOrgName: "",
                    applyDeptName: "",
                    applyDoctorName: "",
                    applyTime: "",
                    itemName: "",
                    reportOrgName: "",
                    occurTime: "",
                    indexName: "",
                    indexVal: "",
                    normalValBottom: "",
                    normalValTop: "",
                    sourceType: "",

                },
                dangervalDealTypelist: [], //处理类型字典
                dangervalDealTypeselect: "",
                listordeal: true,

            }
        },
        computed: {

        },
        components: {
            moduleHead, menuList, selfTest
        },
        ready() {
            var that = this;
            // 获取字典
            $.when(Public.commonajax("coms.multipleDictionaryService", "findDic", "[['base.dictionary.base_dangervalDealType']]"))
                .done(function(res) {
                    if (res.code == 200) {
                        that.dangervalDealTypelist = res.body[0].items;
                    }
                })
                // 根据dangerRecordId获取信息
            $.when(Public.commonajax("coms.dangerIndexRecordService", "findDangerIndexRecordById", "['" + Public.getParameter("dangerRecordId") + "']"))
                .done(function(res) {
                    if (res.code == 200) {
                        res.body.applyTime = res.body.applyTime != null ? res.body.applyTime.substr(0, 10) : "未填写";
                        res.body.occurTime = res.body.occurTime != null ? res.body.occurTime.substr(0, 10) : "未填写";
                        that.patientinfo = res.body;

                    }

                })

        },
        methods: {
            // 保存危急值处理
            savedangerdeal() {
                    $.when(Public.commonajax("coms.dangerIndexRecordService", "dealDangerIndexRecord", "['" + this.patientinfo.dangerRecordId + "','" + this.dangervalDealTypeselect + "']"))
                        .done(function(res) {
                            if (res.code == 200) {
                                window.location.replace("index.html")
                            }

                        })
                },

                // 点击返回上一页 显示处理危急值页面
                dealshow() {
                    this.listordeal = true;
                    $(".twostep").show();//必须用这个方法 不然组件请求会出错
                    $(".selftestlist").hide();

                },
                // 点击健康监测显示列表
                listshow() {
                    this.listordeal = false;
                    $(".twostep").hide();
                    $(".selftestlist").show();
                    this.$refs.selftestval.searchselftestbytime(this.patientinfo.mpiId);

                },


        },
        events: {

        },
        watch: {

        }
}
$(function() {

})
</script>
<style scoped>
.modal-lg {
    width: 950px;
}

.modal-dialog {
    margin-top: 0
}

#edit_danger .modal-body {
    padding-bottom: 30px;
    min-height: 550px;

}

#edit_danger .modal-header {
    padding: 0;
    border-bottom: 1px solid #e5e5e5;
    height: 60px;
    background: #FAFAFA;
    border-radius: 5px 5px 0 0;
}

.twostep_1,
.twostep_2 {
    border: 1px solid #d3d3d3;
    width: 760px;
    margin: 20px auto 0;
    padding-top: 20px;
    position: relative;
    
}
.twostep_2{height: 100px;}
.twostep h4 {
    background: #fff;
    width: 80px;
    text-align: center;
    padding: 0 10px;
    color: #bbbbbb;
    position: absolute;
    font-size: 12px;
    height: 30px;
    line-height: 30px;
    top: -15px;
    left: 50px;
}

.twostep_1 p {
    line-height: 30px;
    margin:20px auto;
    padding: 0 20px
}

.paientinfo {
    padding-bottom: 20px;
    border-bottom: 1px dashed #EFEFEF;
    width: 90%;
    margin: 20px auto;
}

.paientinfo table {
    width: 100%;
}

.paientinfo table td p span {
    display: inline-block;
    margin-left: 10px;
    height: 20px;
}

.paientinfo table td .iphone {
    background: url(../../assets/img/iphone.png) no-repeat left center;
    padding-left: 20px;
}

.paientinfo table td .other {
    font-size: 12px;
    color: #999;
}

.paientinfo table td .name {
    font-weight: 700;
}

.twostep_1 p span {
    padding-left: 30px;

}

.twostep_1 p span.zhibiao {
    display: inline-block;
    background: url(../../assets/img/up_arrow.png) no-repeat right center;
    padding-right: 10px;
    width: 100px;
}

.twostep_1 p span.zhibiao2 {
    display: inline-block;
    background: url(../../assets/img/down_arrow.png) no-repeat right center;
    padding-right: 10px;
    width: 100px;
}
.selftestlist{margin:0 auto;display: none;}
</style>
